<template>
  <div v-if="modalShow">
    <Modal ref="tablemodal" v-model="modalShow" :loading="modalloading" :mask-closable="true" width="900">
      <p slot="header" style="text-align: center">
        <span>协议内容</span>
      </p>
      <div class="content_styl" ref="creditQrCodeShare">
        <h2 class="head_styl">竞拍协议</h2>
        <div v-html="content"></div>
        <!-- <div class="main-styl">
          <h4>一、竞价规则</h4>
          <div class="text-styl">1、在本电商平台进行的所有交易应当遵循公平、公正、公开和诚实守信的原则。本规则适用于振华电商平台发生的油品与化工产品等一切商品的销售竞价活动。</div>
          <div class="text-styl">2、竞买人条件：满足参与活动设定权限并且未曾违反竞价规则</div>
          <div class="text-styl">3、竞拍按照价格优先，同等报价时间优先的原则。</div>
          <div class="text-styl">4、竞拍价格需大于等于供应商设定的竞拍底价（大于等于起拍价）才算有效。</div>
          <div class="text-styl">5、竞拍分为“允许延时”和“不允许延时”。</div>
          <div class="text-styl">6、如果竞拍参与人数没有达到供应商设置的最低有效参与人数，则该竞拍无效，标的自动流拍。</div>
          <h4>二、保证金须知</h4>
          <div class="text-styl">1、保证金是指买方为获得交易资格，并用于保障买卖合同的缔结和执行而交纳的资金，同时作为买方在交易和交割过程中出现的违约处罚金。</div>
          <div class="text-styl">2、用户需按供应商要求及时足额缴纳保证金，由供应商在发布活动时设定，只有确认已付保证金的用户才能参与竞拍。</div>
          <div class="text-styl">3、用户如果提供任何虚假证件信息，存在违法违规，不遵守平台规则，违反竞价规则及违约等不诚信行为的，供应商有权选择扣除该用户部分或者全部保证金。</div>
          <div class="text-styl">4、竞价报价结束后，本平台将已成交用户的保证金转为货款，并自动释放所有未成交用户的保证金。</div>
          <h4>三、延时规则</h4>
          <div class="text-styl">1、竞拍数量大于等于竞拍总量（或者剩余数量小于最小购买量）。</div>
          <div class="text-styl">2、竞拍价格大于当前有效最低价。</div>
        </div> -->
        <div class="foot_styl">
          <div>
            <Checkbox v-model="single">
              阅读并同意以上协议，并缴纳扣除 ¥{{ rowData.bondAmount }} 元竞拍保证金。</Checkbox>
          </div>
        </div>
      </div>

      <div slot="footer">
        <Button type="text" @click="modalShow = false">不同意</Button>
        <Button type="primary" @click="submitFun">我同意</Button>
      </div>
    </Modal>
  </div>
</template>
<script>
export default {
  mixins: [],
  components: {},
  data() {
    return {
      single: false,
      modalShow: false,
      rowData: {},
      modalloading: false
    };
  },
  props: {
    content: { type: String }
  },
  mounted() {},
  methods: {
    // 打开窗口
    openFun(row) {
      this.rowData = row;
      this.modalShow = true;
    },
    //我同意
    submitFun() {
      if (!this.single) {
        this.$Message.error("请阅读并同意以上协议!");
        return;
      }
      this.modalShow = false;
      this.$emit("success");
    }
  }
};
</script>
<style lang="less" scoped>
@import "~@/assets/styles/main.less";

::v-deep .ivu-modal-header {
  background-image: url("~@/assets/images/modal_back900.png") !important;
}
.content_styl {
  padding: 0 20px;
  line-height: 1.5;
  .head_styl {
    padding-top: 20px;
    text-align: center;
  }
  .text-styl {
    margin-bottom: 10px;
  }
  .foot_styl {
    .flex-x();
    margin-top: 30px;
    font-weight: bold;
    color: @themeColor;
  }
}
</style>